<!DOCTYPE html>
<html style="background-color: #F1F4FB">

<head>
    <meta charset="utf-8">
    <title>集成电路布图台账页面</title>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/supplier/common/css/style.css"/>
    <!--extended-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/extended.css"/>
    <!--Layui-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--公用样式JS-->
    <script type="text/javascript" src="${re.contextPath}/plugin/jquery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/comment.js"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.js" charset="utf-8"></script>
</head>
<style>
    .Right {
        overflow-y: auto;
        width: 100%;
        left: 16%;
        top: 144px;
    }

    .layui-table-cell {
        text-align: center;
        font-size: 14px;
        padding: 0 5px;
        height: auto;
        overflow: visible;
        text-overflow: inherit;
        white-space: normal;
        word-break: break-all;
    }

    .layui-laypage-limits select {
        width: 70px;
    }
</style>

<body>
<!--头部-->

<!--容器-->
<div class="layui-container"
     style="background-color: #ffffff;width:96%;margin-top:60px;padding:16px;border-radius: 10px">
    <!--筛选行-->
    <div style="background-color: #F1F4FB;border-radius: 5px;padding:14px 15px 14px 10px">
        <div class="layui-row">
            <!--软著名称-->
            <form id="query-form">
                <div class="layui-col-md3">
                    <span>布图设计名称:</span>
                    <input id="btsj_name" class="layui-input layui-input-inline" type="text" placeholder="布图设计名称"
                           style="width: 50%">
                </div>
                <!--布图设计颁证日-->
                <div class="layui-col-md5">
                    <span>布图设计颁证日:</span>
                    <input id="sq_date_start" class="layui-input layui-input-inline" type="text" style="width: 32%;"
                           placeholder="开始时间">
                    <span>至</span>
                    <input id="sq_date_end" class="layui-input layui-input-inline" type="text" style="width: 32%;"
                           placeholder="结束时间">
                </div>
                <div class="layui-col-md1" style="text-align: end;width: 20%;float: right;">
                    <input class="layui-btn layui-btn-normal" style="border-radius:5px;" type="button" value="筛选"
                           onclick="query()">
                    <input class="layui-btn layui-btn-normal ml10" type="button"
                           style="border-radius:5px;background-color: #FF5722;" value="重置"
                           onclick="resetQuery()">
                </div>
            </form>
        </div>
        <#--		<div class="layui-row" style="margin-top:8px">-->
        <#--				<div class="layui-col-md3 layui-col-md-offset9">-->
        <#--&lt;#&ndash;				<input class="layui-btn layui-btn-danger layui-btn-sm fr ml10" type="button" value="重置" onclick="resetQuery()">&ndash;&gt;-->
        <#--				<input class="layui-btn layui-btn-normal layui-btn-sm fr" type="button"  value="筛选" onclick="query()">-->
        <#--			</div>-->
        <#--		</div>-->
    </div>
    <div style="height:40px"></div>
    <div class="layui-row">
        <div class="layui-col-md3 layui-col-md-offset9">
            <@shiro.hasPermission name="search:export">
                <input class="layui-btn layui-btn-normal layui-btn-sm fr ml10" type="button" value="导出Excel"
                       onclick="exportTable()">
            </@shiro.hasPermission>
            <@shiro.hasPermission name="search:view">
                <input class="layui-btn layui-btn-danger layui-btn-sm fr" type="button" value="预览Excel"
                       onclick="viewTable()">
            </@shiro.hasPermission>
        </div>
    </div>
    <div class="layui-row">
        <table id="booktable" layui-filter="booktable">

        </table>
    </div>

    <#--	<div class="Right fr mt10">-->
    <#--		<div class="layui-row" style="background-color: #e0e0e0;padding:20px 1%;margin-top:30px;border-radius: 5px">-->
    <#--			<div class="layui-col-md2">-->
    <#--				<span>计划类别:</span>-->

    <#--			</div>-->
    <#--			<div class="layui-col-md2" style="width: 26%">-->
    <#--				<span style="display: inline-block;width:27%">获取时间:</span>-->
    <#--				<input id="hp_time_begin" type="text"  style="display: inline-block;width:35%" value="2021-05-01">-->
    <#--				<span>至</span>-->
    <#--				<input id="hp_time_end" type="text"  style="display: inline-block;width:35%"  value="2021-05-02">-->
    <#--			</div>-->
    <#--		</div>-->
    <#--	</div>-->
</div>
<div style="height: 50px"></div>
<#--	<!--右侧内容&ndash;&gt;-->
<script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/tabs.js"></script>
<script type="text/javascript" src="${re.contextPath}/pageoffice.js" id="po_js_main"></script>
<script type="text/javascript">
    var table, tableIns, laydate, form, layer, num;
    layui.use(['laydate', 'table', 'form', 'layer'], function () {
        laydate = layui.laydate;
        table = layui.table;
        form = layui.form;
        layer = layui.layer;
        //执行一个laydate实例
        laydate.render({
            elem: '#sq_date_start', //见刊时间开思
            type: 'date'
        });
        laydate.render({
            elem: '#sq_date_end', //见刊时间结束
            type: 'date'
        });

        initTable();

    });

    function initTable() {
        var jsonData = getQuaryData();
        //方法级渲染
        tableIns = table.render({
            id: 'booktable',
            elem: '#booktable',
            url: '/search/decision/form/book/110004',
            height: "full",
            where: jsonData,
            page: true,
            cols: [[
                {
                    title: '序号', width: '6%', rowspan: 2, templet: function (res) {
                        return res.LAY_INDEX;
                    }
                },
                {field: 'spfF1', title: '布图设计名称', width: '15%'},
                {field: 'spfF2', title: '布图设计登记号', width: '15%'},
                {field: 'spfF3', title: '布图设计权利人名称', width: '10%'},
                {field: 'spfF4', title: '登记证书号', width: '10%'},
                {field: 'spfF5', title: '布图设计颁证日', width: '12%'},
                {
                    field: 'fileList1', title: '集成电路布图设计登记证书', width: '15%', templet: function (d) {
                        var returnStr = '';
                        if (d.fileList1 && d.fileList1.length > 0) {
                            for (var a = 0; a < d.fileList1.length; a++) {
                                returnStr = returnStr + '<p>' + d.fileList1[a].fileName + '</p>';
                            }
                            return returnStr;
                        } else {
                            return '';
                        }
                    }
                },
                {field: 'spfF6', title: '备注'}
            ]],
            done: function (res, current, count) {
                num = count;
            }
        });
    }

    function getQuaryData() {
        //专利名称
        var rzmcSelect = $('#btsj_name').val();

        //登记证书授权时间开始时间
        var sq_startSelect = $('#sq_date_start').val();

        //登记证书授权时间结束时间
        var sq_endSelect = $('#sq_date_end').val();

        var jsondata = {
            spfF1: rzmcSelect,
            obj1: sq_startSelect,
            obj2: sq_endSelect
        };
        return jsondata;
    }

    function query() {
        initTable();
    }

    function resetQuery() {
        document.getElementById('query-form').reset();
        var jsondata = {
            spfF1: '',
            obj1: '',
            obj2: ''
        };
        table.reload('booktable', {
            where: jsondata
        })
    }

    function getZllx(zllx) {
        var zllxListStr = '${zllxListStr}';
        var zllxList = JSON.parse(zllxListStr);
        var returnStr = '';
        if (zllxList && zllxList.length > 0) {
            for (var a = 0; a < zllxList.length; a++) {
                if (zllx == zllxList[a].badtCode) {
                    returnStr = zllxList[a].badtName;
                }
            }
        }
        return returnStr;
    }

    function getJd(jd) {
        var jdListStr = '${jdListStr}';
        var jdList = JSON.parse(jdListStr);
        var returnStr = '';
        if (jdList && jdList.length > 0) {
            for (var a = 0; a < jdList.length; a++) {
                if (jd == jdList[a].badtCode) {
                    returnStr = jdList[a].badtName;
                }
            }
        }
        return returnStr;
    }

    function viewTable() {
        if (num == 0) {
            layer.msg("没有数据不能预览", {icon: 2});
            return;
        }
        var jsondata = getQuaryData();
        layerAjaxGet('/search/decision/form/book/viewTable//110004', jsondata, '', function (res) {
            if (res.flag) {
                if (res.data) {
                    var w = ($(window).width() * 0.8);
                    var h = ($(window).height() * 0.8);
                    POBrowser.openWindowModeless('/sys/office/openwordTemp?ft=1&fid=' + res.data, 'width=1200px;height=800px;', '{}')
                }
            }
        })

    }

    function exportTable() {
        if (num == 0) {
            layer.msg("没有数据不能导出", {icon: 2});
            return;
        }
        var para = '';
        //软著名称
        var rzmcSelect = $('#rz_name').val();
        if (rzmcSelect) {
            para = para + '&spfF1=' + rzmcSelect;
        }
        //登记证书授权时间开始时间
        var sq_startSelect = $('#sq_date_start').val();
        if (sq_startSelect) {
            para = para + '&obj1=' + sq_startSelect;
        }
        //登记证书授权时间结束时间
        var sq_endSelect = $('#sq_date_end').val();
        if (sq_endSelect) {
            para = para + '&obj2=' + sq_endSelect;
        }
        //获取全部数据:
        var url = '/search/decision/form/export/book/110004?a_=' + Math.random() + para;
        location.href = url;
    }

    function seeAllMembers(zlmc, fmrListStr) {
        var names = [];
        var fmrList = JSON.parse(fmrListStr);
        if (fmrList) {
            for (var a = 0; a < fmrList.length; a++) {
                if (fmrList[a].data1) {
                    var aStData = {};
                    aStData.index = a + 1;
                    aStData.name = fmrList[a].data1;
                    names[names.length] = aStData;
                }
            }
            // for(var b=0;b<20;b++){
            // 	var testData = {};
            // 	testData.index = names.length+1;
            // 	testData.name = '测试';
            // 	names[names.length] = testData;
            // }
            localStorage.setItem("form-project-name", zlmc);
            localStorage.setItem("form-project-members", JSON.stringify(names));
            localStorage.setItem("form-project-field-name", '发明人');
            var w = ($(window).width() * 0.8);
            var h = ($(window).height() * 0.8);
            layer.open({
                type: 2,
                title: false,
                closeBtn: 1,
                shade: 0.8,
                area: [w + 'px', h + 'px'],
                content: '/search/decision/showMembers',
                success: function (layero, index) {

                },
                end: function () {
                    localStorage.removeItem("form-project-name");
                    localStorage.removeItem("form-project-members");
                    localStorage.removeItem("form-project-field-name");
                }
            })
        }
    }


    function seeAllNfs(zlmc, obj2) {
        var cols = [];
        var innerCol = [];

        var field1 = {title: '序号', width: '15%', templet: '#index'};
        innerCol[innerCol.length] = field1;
        var field2 = {field: 'data2', title: '金额', width: '15%'};
        innerCol[innerCol.length] = field2;
        var field3 = {field: 'data3', title: '缴费时间', width: '30%'};
        innerCol[innerCol.length] = field3;
        var field4 = {field: 'data4', title: '年费跨度', width: '20%'};
        innerCol[innerCol.length] = field4;
        var field5 = {field: 'data5', title: '经办人', width: '20%'};
        innerCol[innerCol.length] = field5;
        cols[cols.length] = innerCol;
        localStorage.setItem('form-smart-table-type', 'colsAndDatas');
        localStorage.setItem("form-project-name", zlmc);
        localStorage.setItem("colsAndDatas-cols", JSON.stringify(cols));
        localStorage.setItem("colsAndDatas-datas", obj2);
        var w = ($(window).width() * 0.8);
        var h = ($(window).height() * 0.8);
        layer.open({
            type: 2,
            title: false,
            closeBtn: 1,
            shade: 0.8,
            area: [w + 'px', h + 'px'],
            content: '/search/decision/showMembers',
            success: function (layero, index) {

            },
            end: function () {
                localStorage.removeItem("form-project-name");
                localStorage.removeItem("form-project-members");
                localStorage.removeItem("form-project-field-name");
            }
        })
    }

    $(function () {

        //回车事件
        $(document).keydown(function (e) {
            // 兼容FF和IE和Opera
            var theEvent = e || window.event;
            var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
            if (code == 13) {
                query();
            }
            return true;
        });
    })

    $(function () {
        //回车事件
        $(document).keydown(function (e) {
            // 兼容FF和IE和Opera
            var theEvent = e || window.event;
            var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
            if (code == 13) {
                query();
            }
            return true;
        });
    })
</script>
</body>

</html>